<template>
<i class=" fa fa-chevron-left" @click="fan"></i>
  <h1>继续支付可能出现以下商品</h1>
  <img src="https://img1.baidu.com/it/u=454719486,525374531&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500" alt="">
 <div  class="list">
   <van-button type="default" style="width:50%">
   取消支付</van-button>
   <van-button style="width:50%" type="primary"
    @click="showPopup">继续支付</van-button>
    </div>
<van-popup v-model:show="show" 
 style="width:200px;height:200px;" >
<i class=" fa fa fa-close" @click="fanhui"></i><br>完成支付
</van-popup> 
</template>

<script>
import { ref } from 'vue';

export default {
  methods:{
   fanhui(){
    this.show=false;
   },
   fan(){
    this.$router.push({name:'zhifu'})
   }
  },
  setup() {
    const show = ref(false);
    const showPopup = () => {
      show.value = true;
    };
    return {
      show,
      showPopup,
    };
  },
}
</script>

<style scoped>
    .list{
        display: flex;
    }
    img{
        height:300px;
    }
</style>